<template>
	<div class="carlRoot">
		<div class="carContainer">         
           <swiper auto loop  height="150px">
		      <swiper-item class="black"><img src="../../static/images/1.jpg"/></swiper-item>
		      <swiper-item class="black"><img src="../../static/images/2.jpg"/></swiper-item>
		      <swiper-item class="black"><img src="../../static/images/3.jpg"/></swiper-item>
		      <swiper-item class="black"><img src="../../static/images/4.jpg"/></swiper-item>
		      <swiper-item class="black"><img src="../../static/images/5.jpg"/></swiper-item>
		    </swiper>
		</div>
	</div>
</template>

<script>
	import { Swiper, SwiperItem } from 'vux'

	export default {
         components:{
         	Swiper,
         	SwiperItem
         }
	}
</script>

<style scoped>
	.carlRoot {
		width: 100vw;
		position: relative;
	}
	
	.carContainer {
		width: 100vw;
		overflow: hidden;
		margin: 0 auto;		
	}
	.black{
		width: 100vw;
		height: 150px;
	}
	img{
		width: 100vw;
		height: 150px;
	}
</style>